<wicket:extend>
  <div class="content">
    <div class="container">
      <div class="page-header">
        <center><h1>Signup to HopOn</h1></center>
      </div>
      <div class="row">
        <div class="span6 offset3">
          <div class="well">
            <ul class="nav nav-tabs">
              <li class="active"><a href="#login" data-toggle="tab">Individual</a></li>
              <li><a href="#create" data-toggle="tab">Company</a></li>
            </ul>
            <div id="myTabContent" class="tab-content">
              <div class="tab-pane active in" id="login">
                <form id="tab" class="form-horizontal">
                  <fieldset>
                    <!-- Text input-->
                    <div class="control-group">
                      <label class="control-label" for="Name">Name</label>
                      <div class="controls">
                        <input id="Name" name="Name" type="text" placeholder="Name" class="input-xlarge" required="">

                      </div>
                    </div>

                    <!-- Text input-->
                    <div class="control-group">
                      <label class="control-label" for="Address">Address</label>
                      <div class="controls">
                        <input id="Address" name="Address" type="text" placeholder="Address" class="input-xlarge">

                      </div>
                    </div>

                    <!-- Text input-->
                    <div class="control-group">
                      <label class="control-label" for="mobile">Mobile</label>
                      <div class="controls">
                        <input id="mobile" name="mobile" type="text" placeholder="Mobile" class="input-xlarge">

                      </div>
                    </div>

                    <!-- Text input-->
                    <div class="control-group">
                      <label class="control-label" for="selectbasic">Company</label>
                      <div class="controls">
                        <select id="select1" name="selectbasic" class="input-large">
                          <option>New</option>
                          <option>Infy</option>
                          <option>Wells Fargo</option>
                        </select>
                      </div>
                    </div>

                    <!-- Text input-->
                    <div class="control-group">
                      <label class="control-label" for="locality">Locality</label>
                      <div class="controls">
                        <input id="locality" name="locality" type="text" placeholder="Locality" class="input-xlarge">

                      </div>
                    </div>

                 

                    <!-- Select Multiple -->
                    <div class="control-group">
                      <label class="control-label" for="mycircle">My Circles</label>
                      <div class="controls">
                        <select id="mycircle" name="mycircle" class="input-xlarge" multiple="multiple">
                          <option>Adobe</option>
                          <option>Bridge millenium</option>
                          <option>Project X</option>
                          <option>Tech span</option>
                        </select>
                      </div>
                    </div>

                    <!-- Text input-->
                    <div class="control-group">
                      <label class="control-label" for="age">Age</label>
                      <div class="controls">
                        <input id="age" name="age" type="text" placeholder="Age" class="input-xlarge">

                      </div>
                    </div>

                    <!-- Multiple Radios (inline) -->
                    <div class="control-group">
                      <label class="control-label" for="sex">Sex</label>
                      <div class="controls">
                        <label class="radio inline" for="sex-0">
                          <input type="radio" name="sex" id="sex-0" value="M" checked="checked">
                          M
                        </label>
                        <label class="radio inline" for="sex-1">
                          <input type="radio" name="sex" id="sex-1" value="F">
                          F
                        </label>
                      </div>
                    </div>

                    <!-- Text input-->
                    <div class="control-group">
                      <label class="control-label" for="email">Login Email</label>
                      <div class="controls">
                        <input id="email" name="email" type="text" placeholder="Login Email" class="input-xlarge" required="">

                      </div>
                    </div>

                    <!-- Password input-->
                    <div class="control-group">
                      <label class="control-label" for="password">Password</label>
                      <div class="controls">
                        <input id="password" name="password" type="password" placeholder="Password" class="input-xlarge" required="">

                      </div>
                    </div>

                    <!-- Password input-->
                    <div class="control-group">
                      <label class="control-label" for="re password">Retype Password</label>
                      <div class="controls">
                        <input id="re password" name="re password" type="password" placeholder="Retype Password" class="input-xlarge" required="">

                      </div>
                    </div>

                    <!-- Select Multiple -->
                    <div class="control-group">
                      <label class="control-label" for="travel">Travel</label>
                      <div class="controls">
                        <select id="travel" name="travel" class="input-xlarge" multiple="multiple">
                          <option>Consumer</option>
                          <option>Provider</option>
                          <option>Both</option>
                          <option>Taxi</option>
                        </select>
                      </div>
                    </div>

                    <!-- Select Basic -->
      
                    <!-- add more -->
                    <div class="control-group">
                      <label class="control-label" for="textinput"></label>
                      <div class="controls">
                        <a href="#">Add  Vehicle</a>

                      </div>
                    </div>

                    <div class="control-group">
                      <div class="controls">
                        <button type="submit" class="btn btn-primary ">Register</button>
                        <button type="submit" class="btn ">Edit</button>
                      </div>
                    </div>

                  </fieldset>
                </form>
              </div>
              <div class="tab-pane fade" id="create">
                <form id="tab" class="form-horizontal">
                  <fieldset>
                    <!-- Text input-->
                    <div class="control-group">
                      <label class="control-label" for="textinput">Company</label>
                      <div class="controls">
                        <input id="textinput" name="textinput" placeholder="Company" class="input-large" type="text">

                      </div>
                    </div>

                    <!-- Text input-->
                    <div class="control-group">
                      <label class="control-label" for="textinput">Address</label>
                      <div class="controls">
                        <input id="textinput" name="textinput" placeholder="Address" class="input-large" type="text">

                      </div>
                    </div>

                    <!-- Select Basic -->
                  
                    <div class="control-group">
                      <label class="control-label" for="company">Company/Taxi</label>
                      <div class="controls">
                        <input id="Radio1" value="C" name="company" type="radio" class="input-xlarge"> Company
                        <input id="Radio2" value="T" name="company" type="radio" class="input-xlarge"> Taxi
                      </div>
                    </div>

                         <div class="control-group">
                      <label class="control-label" for="textinput">Company Sector</label>
                      <div class="controls">
                        <input id="text1" name="textinput" placeholder="CSector" class="input-large" type="text">

                      </div>
                    </div>

                    <!-- Text input-->
                    <div class="control-group">
                      <label class="control-label" for="textinput">Phone No</label>
                      <div class="controls">
                        <input id="textinput" name="textinput" placeholder="Phone No" class="input-large" type="text">

                      </div>
                    </div>

                    <!-- Textarea -->
                    <div class="control-group">
                      <label class="control-label" for="textarea">Areas</label>
                      <div class="controls">                     
                        <textarea id="textarea" name="textarea">default text</textarea>
                      </div>
                    </div>

                    <!-- Select Multiple -->
                    <div class="control-group">
                      <label class="control-label" for="selectmultiple">Branches</label>
                      <div class="controls">
                        <select id="selectmultiple" name="selectmultiple" class="input-large" multiple="multiple">
                          <option>Bangalore</option>
                          <option>Chennai</option>
                          <option>Gurgaon</option>
                        </select>
                      </div>
                    </div>

                    <!-- Text input-->
                    <div class="control-group">
                      <label class="control-label" for="textinput">Rates</label>
                      <div class="controls">
                        <input id="textinput" name="textinput" placeholder="Rates" class="input-medium" type="text">

                      </div>
                    </div>

                    <!-- Select Basic -->
                    <div class="control-group">
                      <label class="control-label" for="selectbasic">Employees</label>
                      <div class="controls">
                        <select id="selectbasic" name="selectbasic" class="input-large">
                          <option>1 - 10</option>
                          <option>1 - 100</option>
                          <option>1 - 200</option>
                        </select>
                      </div>
                    </div>

               <!--     <!-- Text input-->
                    <div class="control-group">
                      <label class="control-label" for="textinput">Add Vehicle</label>
                      <div class="controls">
                        <input id="textinput" name="textinput" placeholder="Add Vehicle" class="input-large" type="text">

                      </div>
                    </div>-->
                    <!-- add more -->
                    <div class="control-group">
                      <label class="control-label" for="textinput"></label>
                      <div class="controls">
                        <a href="#">Add More Vehicle</a>

                      </div>
                    </div>

                    <!-- Button (Double) -->
                    <div class="control-group">
                      <label class="control-label" for="button1id"></label>
                      <div class="controls">
                        <button id="button1id" name="button1id" class="btn btn-primary ">Register</button>
                        <button id="button2id" name="button2id" class="btn btn-default ">Edit</button>
                      </div>
                    </div>

                  </fieldset>
                </form>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</wicket:extend>